<!--
  单个商品预分仓
-->
<template>
  <!-- 录入预分仓 -->
  <el-dialog title="" :visible.sync="visible" :close-on-click-modal="false" width="50%" class="dialogText header-none" element-loading-background="rgba(0, 0, 0, 0.8)" center @closed="cancel">
    <div>
      <el-form ref="enterform" :model="form" label-width="110px">
        <el-row>
          <mainTilte title="出运商品信息" />
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="系统sku">
              <el-input :value="product.goods_code" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="转运数量">
              <el-input :value="product.trans_number" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <mainTilte title="预分仓" left-title="添加" @editClick="editClickAdd" />
        </el-row>
        <el-row v-for="(item, index) in form.list" :key="index">
          <el-col :span="11">
            <el-form-item label="选择仓库" :prop="`list[${index}].virtual_warehouse_id`" :rules="virtualWarehouseRule">
              <el-select v-model="item.virtual_warehouse_id" filterable clearable>
                <el-option v-for="i in virtualWarehouseList" :key="i.id" :label="i.name" :value="i.id" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="输入分仓数量" :prop="`list[${index}].number`" :rules="numberRule">
              <el-input-number v-model.trim="item.number" :precision="0" :min="1" />
            </el-form-item>
          </el-col>
          <el-col :span="2">
            <div class="tac">
              <span class="delete_style lh40" style="margin: 0;" @click="delItem(index)">删除</span>
            </div>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="cancel">取消预分仓</el-button>
      <el-button type="primary" @click="enterWarehouseConfirm">确认预分仓</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  name: 'InputPreDialog',
  data() {
    return {
      visible: false,
      product: {}, // 商品详情
      form: {
        list: [] // 列表
      },
      numberRule: [
        {
          required: true,
          message: '请输入分仓数量',
          trigger: 'blur'
        }
      ],
      type: '', // product 商品 part 配件
      virtualWarehouseList: [], // 虚拟仓列表
      //
      virtualWarehouseRule: [
        { required: true, message: '请选择仓库', trigger: ['change', 'blur'] }
      ]
    }
  },
  computed: {},
  created() {
    this.getVirtualWarehouse() // 获取虚拟仓列表
  },
  methods: {
    // 显示弹窗
    show(product, form, type) {
      const vm = this
      vm.product = product
      if (form) {
        vm.form.list = form.products.concat()
      }
      vm.type = type
      vm.visible = true
    },
    // 取消
    cancel() {
      const vm = this
      vm.visible = false
      vm.form.list = []
      vm.product = {}
    },
    // 删除
    handleDeleteProduct(index) {
      const vm = this
      vm.enterformData.products.splice(index, 1)
    },
    // 获取虚拟仓列表
    getVirtualWarehouse() {
      const vm = this
      const params = {
        page: 1,
        limit: 100000000,
        type: 2, // 1-实体仓 2-虚拟仓 3-残品仓 4-FBA仓
        is_active: 1
      }
      vm.$http.get('/warehouse', { params }).then((res) => {
        vm.virtualWarehouseList = res.data
      })
    },
    // 确认预分仓
    enterWarehouseConfirm() {
      const vm = this
      vm.$refs.enterform.validate((valid) => {
        if (valid) {
          if (this.form.list.length <= 0) {
            return this.$message.error('请选择添加预分仓')
          }
          const transNumber = +vm.product.trans_number
          const countObj = this.form.list.reduce(
            (count, ele) => {
              const number = +ele.number
              count.sum += number
              if (
                !count.virtualWarehouseIds.includes(ele.virtual_warehouse_id)
              ) {
                count.virtualWarehouseIds.push(ele.virtual_warehouse_id)
              }
              return count
            },
            { sum: 0, virtualWarehouseIds: [] }
          )
          if (countObj.virtualWarehouseIds.length !== this.form.list.length) {
            this.$message.error('添加的仓库必须不一致')
            return
          }
          if (countObj.sum !== transNumber) {
            this.$message.error('各仓库分仓数量汇总要等于转运数量')
            return false
          }
          this.$emit('submit', {
            item: { id: this.product.id, products: this.form.list },
            type: this.type
          })
          this.cancel()
        }
      })
    },
    // 预分仓点击添加
    editClickAdd() {
      this.form.list.push({
        trans_goods_id: this.product.id,
        virtual_warehouse_id: '',
        number: 1 //  输入分仓数量
      })
    },
    // 删除
    delItem(index) {
      this.form.list.splice(index, 1)
    }
  }
}
</script>

<style lang="less" scoped></style>
